<extend file='resource/view/admin'/>
<block name="content">
    <ul class="nav nav-tabs" role="tablist">
        <li class="active"><h3>轮播图管理</h3></li>
    </ul>
    <br>
    <form action="" method="post" class="form-horizontal" role="form">
        <div class="panel panel-default ">
            <div class="panel-heading">
                <h3 class="panel-title">图片编辑</h3>
            </div>
            <div class="panel panel-body">

                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">图片标题</label>
                    <div class="col-sm-3">
                        <input type="text" class="form-control" value="{{$model['slide_title']}}" name="slide_title"
                               placeholder="">
                    </div>
                </div>

                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">图片排序</label>
                    <div class="col-sm-3">
                        <input type="number" name="slide_orderby" value="{{$model['slide_orderby']}}" class="form-control"
                               id="" placeholder="">
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">上传图片</label>
                    <div class="col-sm-4">
                        <div class="input-group">
                            <input type="text" class="form-control" name="slide_thumb" readonly=""
                                   value="{{$model['slide_thumb']}}">
                            <div class="input-group-btn">
                                <button onclick="upImage(this)" class="btn btn-default" type="button">选择图片</button>
                            </div>
                        </div>
                        <div class="input-group" style="margin-top:5px;">
                            <img src="{{pic($oldData['slide_thumb'],'resource/images/nopic.jpg')}}"
                                 class="img-responsive img-thumbnail" width="150">
                            <em class="close" style="position:absolute; top: 0px; right: -14px;" title="删除这张图片"
                                onclick="removeImg(this)">×</em>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">图片链接 </label>
                    <div class="input-group col-sm-4">
                        <div class="input-group-addon ">http://www.</div>
                        <input type="text" value="{{$model['slide_linkurl']}}" class="form-control" name="slide_linkurl"
                               placeholder="">
                        <div class="input-group-addon">.com</div>
                    </div>
                </div>
                <button type="submit" class="btn btn-primary  btn-lg">提交</button>
            </div>
        </div>
    </form>
    <script>
        //上传图片
        function upImage(obj) {
            require(['util'], function (util) {
                options = {
                    multiple: false,//是否允许多图上传
                    //data是向后台服务器提交的POST数据
                    data: {name: 'xxx', year: 2017},
                };
                util.image(function (images) {          //上传成功的图片，数组类型

                    $("[name='slide_thumb']").val(images[0]);
                    $(".img-thumbnail").attr('src', images[0]);
                }, options)
            });
        }
        //移除图片
        function removeImg(obj) {
            $(obj).prev('img').attr('src', 'resource/images/nopic.jpg');
            $(obj).parent().prev().find('input').val('');
        }
    </script>
</block>